<template>
    <!-- 修改资料 -->

    <div>
        <!-- 内容主题区域 -->
        <el-form :model="form" label-position="right" ref="formRef" disabled>
            <el-row :gutter="15">
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="编号">
                        <el-input v-model="form.number" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="名称">
                        <el-input v-model="form.name" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="简称">
                        <el-input v-model="form.forShort" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="英文名">
                        <el-input v-model="form.enName" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="负责人">
                        <el-input v-model="form.principal" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="地址">
                        <el-input v-model="form.address" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="邮编">
                        <el-input v-model="form.postCode" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="联系人">
                        <el-input v-model="form.contact" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="联系电话">
                        <el-input v-model="form.contactPhone" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="传真">
                        <el-input v-model="form.fax" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="邮箱" prop="email">
                        <el-input v-model="form.email" class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="组织类型">
                        <el-input v-model="form.companyTypeLabel" disabled class="borderNone"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="第三方公司">
                        <el-switch v-model="form.thirdCompany" />
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="英文地址">
                        <el-input v-model="form.englishAddress"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                    <el-form-item label="统一社会信用代码">
                        <el-input v-model="form.unifiedSocialCode"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
                    <el-form-item label="报关企业代码">
                        <el-input v-model="form.customsCompanyCode"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        </el-col>
        <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
          <el-form-item label="开户行">
            <el-input v-model="form.bankName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
          <el-form-item label="开户账号">
            <el-input v-model="form.bankAccount"></el-input>
          </el-form-item>
        </el-col>
            </el-row>
        </el-form>
        <sc-title title="附件" />
        <tsFormTable v-model="fileList" disabled>
            <template #tableContent>
                <el-table-column label="图片" width="100">
                    <template #default="scope">
                        <el-image v-if="checkType(scope.row) == 'image'" alt="上传图片" :src="scope.row.fileFullPath"
                            @click="addImage(scope.row.fileFullPath)" :preview-src-list="srcList"
                            preview-teleported></el-image>
                        <video v-else-if="checkType(scope.row) == 'video'" :src="scope.row.fileFullPath" controls
                            style="width: 100%;height: 100%;"></video>
                        <span v-else>{{ scope.row.fileName }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="fileKind" label="类别">
                    <template #default="scope">
                        <span>{{ scope.row.fileKindName }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="itemIndex" label="排序">
                    <template #default="scope">
                        <span>{{ scope.row.itemIndex }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="remark" label="备注">
                    <template #default="scope">
                        <span>{{ scope.row.remark }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="remark" label="状态">
                    <template #default="scope">
                        <el-switch v-model="scope.row.status" size="large" disabled inline-prompt active-value="normal"
                            inactive-value="disable" />
                    </template>
                </el-table-column>
            </template>
        </tsFormTable>
        <sc-title title="银行账户" />
        <el-table :data="dataList">
            <el-table-column prop="bankName" label="开户行"></el-table-column>
            <el-table-column prop="bankAddress" label="银行地址"></el-table-column>
            <el-table-column prop="bankAccount" label="银行帐号" width="300"></el-table-column>
            <el-table-column prop="bankNo" label="开户行代码"></el-table-column>
            <el-table-column prop="correspondentBankName" label="代理行名称"></el-table-column>
            <el-table-column prop="correspondentBankNo" label="代理行代码"></el-table-column>
        </el-table>
        <div class="button-position">
            <el-button @click="updateVisible" type="primary">退 出</el-button>
        </div>
    </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { ElNotification } from 'element-plus';
import { checkType } from '@/utils/checkType.js'
import Api from '@/api/model/user'
import tsFormTable from '@/components/scFormTable/index.vue'
const emit = defineEmits(['updatetable'])
const props = defineProps({
    paramsData: {
        type: Object,
        defalut: {}
    }
})
const fileList = ref([])
const srcList = ref([])
const dataList = ref([])
onMounted(() => {
    getData()
})
// 查看用户数据的对象
const form = ref({});

const updateVisible = (val) => {
    emit('updatetable')
}
const addImage = (val) => {
    srcList.value.unshift(val)
}
//调取数据
const getData = async () => {
    let res = await Api.company.detail.post(props.paramsData);
    console.log(res)
    if (res.code == 200) {
        form.value = res.data;
        dataList.value = res.dataList;
        fileList.value = res.fileList
        // srcList.value.push(res.data.fileFullPath)
    } else {
        form.value = '';
    }

}


</script>

<style lang="less" scoped>
.borderNone {
    :deep(.el-input__wrapper) {
        box-shadow: 0 0 0 0px var(--el-input-border-color, var(--el-border-color)) inset;
        cursor: default;
        background-color: transparent; //背景颜色透明
        border-bottom: 1px solid #999;
        border-radius: 0;

        .el-input__inner {
            cursor: default !important;
        }
    }
}
</style>
